<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>首页</title>
<link rel="stylesheet" href="../../Content/css/bootstrap.min.css" />
<link rel="stylesheet" href="../../Content/css/font-awesome.min.css" />
<link rel="stylesheet" href="../../Content/css/base.css" />
</head>

<body>
<div class="container-fluid">
	<div class="row">
    	<div class=" col-sm-12 draganddrop-container">
        	<div class="draganddrop-box">
                <div class="draganddrop-header">
                	<div class="drag-title">
                    	<span class="drag-main-title">万达CTO</span>
                        <span class="drag-subtitle">新推荐</span>
                        <span class="drag-subtitle">新推荐</span>
                        <span class="drag-subtitle">新推荐</span>
                        <span class="drag-subtitle">新推荐</span>
                    </div>
                    <div class="drag-item-tip" data-flag="collapse1">
                    	<span>1</span>
                        <span>2</span>
                        <span>3</span>
                        <span>4</span>
                    </div>
                    <div class="drag-collapse">
                     	<span class="glyphicon glyphicon-menu-down"  data-toggle="collapse" data-target="#collapse1" aria-expanded="" aria-controls="collapse1"></span>
                    </div>
                </div>
                <div id="collapse1" class="draganddrop-body  collapse">
                	<div class="drag-items">
                    	<div class="drag-item-title"><span class="title-num">1</span><span class="title-text">面试</span></div>
                    	<ul class="list-unstyled drag-item-content">
                        	<li>
                            	<div class="drag-item-col">候选人</div>
                                <div class="drag-item-col">北京东方伯乐</div>
                                <div class="drag-item-col">2015-02-22 22:22:22</div>
                            </li>
                        </ul>
                        <div class="drag-item-title"><span class="title-num">2</span><span class="title-text">新推荐</span></div>
                        <ul class="list-unstyled drag-item-content">
                        	<li>
                            	<div class="drag-item-col">候选人</div>
                                <div class="drag-item-col">北京东方伯乐</div>
                                <div class="drag-item-col">2015-02-22 22:22:22</div>
                            </li>
                            <li>
                            	<div class="drag-item-col">候选人</div>
                                <div class="drag-item-col">北京东方伯乐</div>
                                <div class="drag-item-col">2015-02-22 22:22:22</div>
                            </li>
                            <li>
                            	<div class="drag-item-col">候选人</div>
                                <div class="drag-item-col">北京东方伯乐</div>
                                <div class="drag-item-col">2015-02-22 22:22:22</div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class=" col-sm-12 draganddrop-container">
        	<div class="draganddrop-box">
                <div class="draganddrop-header">
                	<div class="drag-title">
                    	<span class="drag-main-title">万达CTO</span>
                        <span class="drag-subtitle">新推荐</span>
                        <span class="drag-subtitle">新推荐</span>
                        <span class="drag-subtitle">新推荐</span>
                        <span class="drag-subtitle">新推荐</span>
                    </div>
                    <div class="drag-item-tip" data-flag="collapse2">
                    	<span>1</span>
                        <span>2</span>
                        <span>3</span>
                        <span>4</span>
                    </div>
                    <div class="drag-collapse">
                     	<span class="glyphicon glyphicon-menu-down"  data-toggle="collapse" data-target="#collapse2" aria-expanded="" aria-controls="collapse2"></span>
                    </div>
                </div>
                <div id="collapse2" class="draganddrop-body  collapse">
                	<div class="drag-items">
                    	<div class="drag-item-title"><span class="title-num">1</span><span class="title-text">面试</span></div>
                    	<ul class="list-unstyled drag-item-content">
                        	<li>
                            	<div class="drag-item-col">候选人</div>
                                <div class="drag-item-col">北京东方伯乐</div>
                                <div class="drag-item-col">2015-02-22 22:22:22</div>
                            </li>
                        </ul>
                        <div class="drag-item-title"><span class="title-num">2</span><span class="title-text">新推荐</span></div>
                        <ul class="list-unstyled drag-item-content">
                        	<li>
                            	<div class="drag-item-col">候选人</div>
                                <div class="drag-item-col">北京东方伯乐</div>
                                <div class="drag-item-col">2015-02-22 22:22:22</div>
                            </li>
                            <li>
                            	<div class="drag-item-col">候选人</div>
                                <div class="drag-item-col">北京东方伯乐</div>
                                <div class="drag-item-col">2015-02-22 22:22:22</div>
                            </li>
                            <li>
                            	<div class="drag-item-col">候选人</div>
                                <div class="drag-item-col">北京东方伯乐</div>
                                <div class="drag-item-col">2015-02-22 22:22:22</div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="../../Scripts/jquery.min.js"></script>
<script src="../../Scripts/bootstrap.min.js"></script>
<script src="../../Scripts/jquery-ui-1.10.3.full.min.js"></script>
<script>
	$(function(){
		//拖拽插件调用方式
		$('.draganddrop-container').sortable({
			connectWith: '.draganddrop-container',
			items:'> .draganddrop-box',
			opacity:0.8,
			revert:true,
			forceHelperSize:true,
			placeholder: 'draganddrop-placeholder',
			forcePlaceholderSize:true,
			tolerance:'pointer'
		});
	})
</script>

</body>
</html>
